<template>
	<view class="all">
		<view class="top">
			<view class="jifen">兑换数额</view>
			<view class="jifen">手续费 <text style="color: blue;">{{list.withdraw_percentage}}%</text> 积分</view>
		</view>
		<view class="list">
			<view class="list_top"> 兑换数额 </view>
			<view class="list_box">
				<input placeholder="请输入兑换数额" type="number" :value="shue" class="list_box_input" @input="input_tap"/>
				<view class="list_box_text" @click="all_tap"> | 全部 </view>
			</view>
		</view>
		<view v-if="shue != ''">
			<view class="list">
				<view style="display: flex;justify-content: space-between;">
					<view class="list_top"> 到账数额 </view>
					<view class="list_top" style="font-size: 26upx;color: #999;font-weight: 300;"> 手续费 = <text style="color: #ff0000;">{{for_data[0]}}</text> 积分 </view>
				</view>
				<view class="list_box">
					<input type="number" disabled :value="shue - for_data[0]" class="list_box_input"/>
				</view>
			</view>
			<view class="list">
				<view style="display: flex;justify-content: space-between;">
					<view class="list_top"> 优荟积分 </view>
					<view class="list_top" style="font-size: 26upx;color: #999;font-weight: 300;"> <text style="color: #ff0000;"> {{100 - yh}} % </text>  </view>
				</view>
				<view class="list_box">
					<input type="number" disabled :value="yhs" class="list_box_input"/>
				</view>
			</view>
			<view class="list">
				<view style="display: flex;justify-content: space-between;">
					<view class="list_top"> 原始股权 </view>
					<view class="list_top" style="font-size: 26upx;color: #999;font-weight: 300;"> <text style="color: #ff0000;">{{list.weighted}}%</text>  </view>
				</view>
				<view class="list_box">
					<input type="number" disabled :value="for_data[2]" class="list_box_input"/>
				</view>
			</view>
			<view class="list">
				<view style="display: flex;justify-content: space-between;">
					<view class="list_top"> 消费积分 </view>
					<view class="list_top" style="font-size: 26upx;color: #999;font-weight: 300;"> <text style="color: #ff0000;">{{list.shop_percentage}}%</text>  </view>
				</view>
				<view class="list_box">
					<input type="number" disabled :value="for_data[3]" class="list_box_input"/>
				</view>
			</view>
			
		</view>
		<view class="list">
			<view class="list_top"> 交易密码 </view>
			<view class="list_box">
				<input placeholder="请输入交易密码" type="number" class="list_box_input" @input="password_tap"/>
			</view>
		</view>
		<view class="tishi">
			温馨提示：
			<view> 1.收益积分兑换手续费{{list.withdraw_percentage}}%。 </view>
			<view> 2.收益积分兑换最低100积分起。 </view>
			<view> 3.扣除手续费后，原始股权占比{{list.weighted}}%，消费积分占比{{list.shop_percentage}}%。 </view>
			<view> 4.如果长时间未到账，请及时联系客服。 </view>
		</view>
		<view class="queren">
			<view :class="queren_key == 1?'queren_texts':'queren_text'" @click="friends_exchange_api"> 确认兑换 </view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				placeholder:'可提现0积分',
				shue:'',
				password:'',
				queren_key:0,
				name:'',
				dynamic_integral:'',
				list:{},
				shue_data:0,
				shue_data_key:0,
				shue_data_bf:0,
				integral:0,
				integral_jf:0,
				consumption:0,
				consumption_key:0,
				for_data:[],
				yh:0,
				yhs:0
			}
		},
		onShow() {
			this.user_config_api()
			this.user_assets_api()
		},
		methods: {
			user_assets_api() {
				var that = this
				that.$request(that.$Api.user_assets_api, {
					access_token: uni.getStorageSync('access_token'),
				}, "POST").then(res => {
					if (res.data.code == 0) {
						that.dynamic_integral = res.data.data.dynamic_integral
					} else {
						uni.showToast({
							title: res.data.msg,
							duration: 2000,
							icon: 'none'
						});
					}
				})
			},
			all_tap() {
				if( this.dynamic_integral >= 100 ) {
					this.shue = this.dynamic_integral
					this.yh = Number(this.list.withdraw_percentage) + Number(this.list.weighted)
					this.for_data = this.jsevent(this.shue,[Number(this.list.withdraw_percentage),this.yh,Number(this.list.weighted),Number(this.list.shop_percentage)])
					this.yhs =(Number(this.shue) - Number(this.for_data[0])) - ( Number(this.for_data[2])+Number(this.for_data[3]) )
					this.queren_key_tap()
				}else{
					uni.showToast({
						title: '不可小于100',
						duration: 2000,
						icon: 'none'
					});
				}
			},
			friends_exchange_api() {
				var that = this
				if( that.queren_key == 0 ) {
					return
				}
				if( that.shue <= 99 ) {
					uni.showToast({
						title: '不可小于100',
						duration: 2000,
						icon: 'none'
					});
					return
				}
				that.$request(that.$Api.friends_exchange_api, {
					access_token: uni.getStorageSync('access_token'),
					money:that.shue,
					password:that.password,
				}, "POST").then(res => {
					if (res.data.code == 0) {
						// that.user_assets_api()
						uni.showToast({
							title: res.data.msg,
							duration: 2000,
							icon: 'none'
						});
						setTimeout(function () {
							uni.navigateBack()
						}, 2000);
					} else {
						uni.showToast({
							title: res.data.msg,
							duration: 2000,
							icon: 'none'
						});
					}
				})
			},
			///首页
			user_config_api() {
				var that = this
				that.$request(that.$Api.user_config_api, {
					access_token: uni.getStorageSync('access_token'),
				}, "POST").then(res => {
					if (res.data.code == 0) {
						that.list = res.data.data
					} else {
						uni.showToast({
							title: res.data.msg,
							duration: 2000,
							icon: 'none'
						});
					}
				})
			},
			record() {
				uni.navigateTo({
					url:'../record/record'
				})
			},
			name_tap(num) {
				this.name = num.detail.value
				this.queren_key_tap()
			},
			input_tap(num) {
				this.shue = num.detail.value
				this.yh = Number(this.list.withdraw_percentage) + Number(this.list.weighted)
				this.for_data = this.jsevent(this.shue,[Number(this.list.withdraw_percentage),this.yh,Number(this.list.weighted),Number(this.list.shop_percentage)])
				this.yhs =(Number(this.shue) - Number(this.for_data[0])) - ( Number(this.for_data[2])+Number(this.for_data[3]) )
				
			},
			jsevent(num,arr){
				for(var i in arr){
					if(i == 0){
						arr[i] = ((Number(num) * (Number(arr[i]) / 100))).toFixed(2)
					}else{
						arr[i] = (( (Number(num) - Number(arr[0])) * (Number(arr[i]) / 100))).toFixed(2)
					}
				}
				console.log('arr',arr)
				return arr
			},
			password_tap(num) {
				this.password = num.detail.value
				this.queren_key_tap()
			},
			queren_key_tap() {
				if( this.shue != '' && this.password != '' ) {
					this.queren_key = 1
				}else{
					this.queren_key = 0
				}
			},
		}
	}
</script>

<style lang="less">
	page{
		.all{
			.queren{
				.queren_text{
					width: 700upx;
					border-radius: 20upx;
					text-align: center;
					line-height: 80upx;
					height: 80upx;
					background: #999;
					color: #fff;
					margin-left: 25upx;
				}
				.queren_texts{
					width: 700upx;
					border-radius: 20upx;
					text-align: center;
					line-height: 80upx;
					height: 80upx;
					background: #ff0000;
					color: #fff;
					margin-left: 25upx;
				}
				width: 750upx;
				padding: 10upx 0;
				background: #fff;
				position: fixed;
				bottom: 0;
				z-index: 2;
			}
			.tishi{
				width: 700upx;
				font-size: 22upx;
				padding: 25upx 25upx 130upx 25upx;
				color: #999;
			}
			.list{
				.list_box{
					.list_box_text{
						font-size: 28upx;
						color: #333;
						margin-top: 4upx;
					}
					.list_box_input{
						width: 500upx;
						font-size: 28upx;
						color: #333;
					}
					display: flex;
					justify-content: space-between;
					margin-top: 20upx;
					background: #eee;
					padding: 15upx;
					width: 670upx;
				}
				.list_top{
					font-size: 36upx;
					font-weight: bold;
				}
				width: 700upx;
				padding: 25upx;
			}
			.top{
				.jifen{
					font-size: 28upx;
					color: #999;
				}
				display: flex;
				width: 700upx;
				padding: 25upx;
				justify-content: space-between;
			}
		}
	}
</style>
